<template>
	<view class="wrap">
		
		<fa-header title="操作详情"></fa-header>
		<!-- 操作信息 -->
		<view class="record-info">
			<view class="record-cell blank operate-info"><view>操作员</view><view>{{recordDetail.UserNameCn}}</view></view>
			<view class="record-cell blank operate-info" ><view>操作时间</view><view>{{recordDetail.OperateTime | dateFormat}}</view></view>
			<view class="record-cell blank operate-info no-border"><view>操作类型</view><view>{{recordDetail.OperationTypeText}}</view></view>
		</view>
		<view v-if="recordDetail.Remark" class="record-cell no-border" style="margin: 40rpx 0;"><view class="blank">备注</view><view style="overflow: auto;text-overflow: clip;white-space: normal;">{{recordDetail.Remark}}</view></view>
		<!-- <view v-if="recordDetail.Remark" class="record-cell no-border"><view class="blank">备注</view><view>{{recordDetail.Remark}}</view></view> -->
		
		<!-- 录入信息 -->
		<entry v-if="recordType === 1" :data="recordDetail"></entry>
		<!-- 编辑信息 -->
		<edit v-if="recordType === 2" :data="recordDetail"></edit>
		<!-- 转移信息 -->
		<transfer v-if="recordType === 3 || recordType === 4 || recordType === 5" :info="recordDetail"></transfer>
		<!-- 缺失移入 -->
		<!-- 资产信息 -->
		<asset v-if="recordType !== 1 && recordType !== 2" :data="recordDetail"></asset>

	</view>
</template>

<script>
	import FaHeader from '../../../components/fa-header/fa-header.vue'
	import Edit from './edit/edit.vue'
	import Asset from './asset/asset.vue'
	import Transfer from './transfer/transfer.vue'
	import Entry from './entry/entry.vue'
	export default {
		components: {
			FaHeader,
			Edit,
			Asset,
			Transfer,
			Entry
		},
		data() {
			return {
				recordDetail: {},
				recordType: 0  // 1 资产录入  2 资产编辑   3 资产转移   4 取消转移  5 移入记录  99 其他情况...
			}
		},
		onLoad({detailId}) {
			this.$api.getOperationDetail({"ID": detailId}).then(res => {
				this.recordDetail = res.data;
				if (res.data.OperationType === 'FASG_OPR_TYPE_0001') {
					this.recordType = 1;
				} else if (res.data.OperationType === 'FASG_OPR_TYPE_0002') {
					this.recordType = 2;
				} else if (res.data.OperationType === 'FASG_OPR_TYPE_0003') {
					this.recordType = 3;
				} else if (res.data.OperationType === 'FASG_OPR_TYPE_0009') {
					this.recordType = 4;
				} else if (res.data.OperationType === 'FASG_OPR_TYPE_0010') {
					this.recordType = 5;
				} else {
					this.recordType = 99;  // 其他情况
				}
			});
			
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		width: 100%;
		min-height: 100vh;
		background: #F6F8FB;
	}
	
	.record-info {
		margin-top: 10rpx;
	}
	
	.operate-info {
		height: 80rpx;
		line-height: 60rpx;
	}
	.record-title {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 36rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 600;
		color: #2A2A2A;
		padding: 10rpx 40rpx;
		background-color: #FFFFFF;
	}
	.record-cell {
		width: 100%;
		min-height: 80rpx;
		font-size: 28rpx;
		padding: 10rpx 40rpx;
		
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #999999;
		display: flex;
		flex-wrap: wrap;
		background-color: #FFFFFF;
		:nth-child(1) {
			width: 25%;
			border-bottom: 2rpx solid #ECECF0;
		}
		:nth-child(2) {
			width: 75%;
			text-overflow: ellipsis;
			overflow: hidden;
			white-space: nowrap;
			border-bottom: 2rpx solid #ECECF0;
		}
	}
	.no-border {
		view {
			border-bottom: none !important;
		}
	}
	.grey {color: #999999;}
	.blank {color: #000000;font-weight: 500;}
</style>
